#top{
   width:100%;
   height: 50px;
   background-color: rgb(10,10,80);
   margin: 0px auto;/*外边距*/
   position: fixed;/*位置：属性值fixed：固定不变*/
   top:0px;/*top bottom left right */
}
body{
	margin: 0;
}

#middle{
 width: 900px;
 height: 800px;
 /*background-color: red;*/
 margin: 0 auto;
 margin-top:50px;
 display: flex;/*弹性盒子模型*/
}
#middle>div:nth-child(1){/*> 儿子*/
	width:200px ;
	height: 200px;
	background-color: yellow;
}
#middle>div:nth-child(2){
	width: 700px;
	height: 100%;
	background-color: greenyellow;
}

#foot{
	width: 100%;
	height: 300px;
	background-color: blueviolet;
}
#foot>div:nth-child(1){/*nth-child 第几个孩子，从1.。。*/
	width: 100%;
	height: 200px;
	background-color: gainsboro;
}
#foot>div:nth-child(2){
	width: 100%;
	height:100px;
	background-color:rgb(10,10,80) ;
}
